<template>
  <div>

    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="1">作业管理</el-menu-item>
      <el-menu-item index="2"@click="jump">文件管理</el-menu-item>
    </el-menu>
    <div class="line"></div>


    <el-card style="padding: 10px">

      <!--      <el-form :model="queryParams">-->
      <!--        <el-input-->
      <!--          style="width: 240px"-->
      <!--          v-model="queryParams.teacherId"-->
      <!--          placeholder="请输入教师id"-->
      <!--        />-->
      <el-button @click="getUser">未批改</el-button>
      <el-button @click="getUser1">已批改</el-button>
      <!--      </el-form>-->


      <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
      >
        <el-table-column label="id" align="center" prop="id" width="150px"/>
        <!--        <el-table-column label="进行中"></el-table-column>-->
        <el-table-column label="作业名" align="center" prop="filename">
          <template slot-scope="scope">
            <a @click="preView(scope.row.filename)" target="_blank" class="buttonText" style="color: #00afff;text-decoration:underline">{{scope.row.filename}}</a>
          </template>
        </el-table-column>
        <!--        <el-table-column label="作业名" align="center" prop="title" />-->
        <!--        <el-table-column label="作业名" align="center" prop="filename" />-->
        <!--        <el-link type="primary">filename</el-link>-->
        <el-table-column label="姓名" align="center" prop="userid"/>
        <el-table-column label="分数" align="center" prop="score" />
        <el-table-column label="操作" width="300px">
          <template slot-scope="scope">
            <el-button type="primary" size="mini" @click="QuestionGive(scope.row)">修改</el-button>
            <!--            <el-button type="primary" size="mini" v-if="scope.row.score!=0?true:false" @click="QuestionGive(scope.row)">修改</el-button>-->
            <!--            <el-button type="primary" size="mini" @click="QuestionGive(scope.row)">修改</el-button>-->
            <el-button type="primary" size="mini" @click="QuestionDelete(scope.row)">打回</el-button>
            <el-button type="primary" size="mini" @click="preView(scope.row)">查看</el-button>
            <!--<el-button type="primary" size="mini" @click="QuestionDetail(scope.row)">查看</el-button>-->
            <!--            <a @click="preView(scope.row.filename)" target="_blank" class="buttonText" style="color: #00afff;text-decoration:underline">{{scope.row.filename}}</a>-->
          </template>
        </el-table-column>



      </el-table>

      <!--      <el-table-->
      <!--        ref="multipleTable"-->
      <!--        :data="tableData1"-->
      <!--        tooltip-effect="dark"-->
      <!--        style="width: 100%"-->
      <!--        >-->
      <!--        <el-table-column label="id" align="center" prop="id" width="150px"/>-->
      <!--        &lt;!&ndash;        <el-table-column label="进行中"></el-table-column>&ndash;&gt;-->
      <!--        &lt;!&ndash;        <el-table-column label="作业名" align="center" prop="title" />&ndash;&gt;-->
      <!--        <el-table-column label="作业名" align="center" prop="filename" />-->
      <!--        &lt;!&ndash;        <el-link type="primary">filename</el-link>&ndash;&gt;-->
      <!--        <el-table-column label="姓名" align="center" prop="userid"/>-->
      <!--        <el-table-column label="分数" align="center" prop="score" />-->
      <!--        <el-table-column label="操作" width="300px">-->
      <!--          <template slot-scope="scope">-->
      <!--            <el-button type="primary" size="mini" @click="QuestionGive(scope.row)">给分</el-button>-->



      <!--          </template>-->
      <!--        </el-table-column>-->
      <!--      </el-table>-->


      <el-dialog title="打分" :visible.sync="dialogFormVisible" width="50%" size="small">

        <el-form label-width="120px">
          <el-form-item label="总分">
            <el-input v-model="this.$route.query.score" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="标签"v-if="false">
            <el-input v-model="form.id" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="分值">
            <el-input v-model="form.score" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="评语">
            <el-input   type="textarea"
                        :rows="2" v-model="form.comments" autocomplete="off"></el-input>
          </el-form-item>
        </el-form>

        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="save">确 定</el-button>
        </div>
      </el-dialog>


    </el-card>



  </div>

</template>

<script>
  import { queryQuestionList} from "@/api/teacher/detail/course/detail";
  import {Now,After,Before} from "@/api/student/topic"
  import { queryProblemByTopicId,eidtProblem,queryProblemById,DeleteProblem,queryByTopicId} from "@/api/teacher/addTopic";
  import { getUserProfile } from "@/api/system/user";
  import { queryCourseList,saveTopic,queryCourseListByCreator,queryCourseListByTitle,saveProblem,queryByTopic} from "@/api/teacher/detail/course/QuestionBank";
  import {puted,give,queryById,Delete,unPut} from "@/api/teacher/studentPut";
  import { GetLink } from "@/api/system/sea-file";

  import {base64} from "@/api/teacher"
  //
  // const base64 = require('js-base64').Base64;
  // const exstr=base64.encode('base64');
  // console.log(exstr);
  // import md5 from 'js-md5';
  // let Base64 = require('js-base64').Base64

  export default {

    name: "studentPut",

    created() {
      this.getUser();
    },
    data(){
      return {
        dialogFormVisible : false,
        form:{},
        activeIndex: '1',
        activeIndex2: '1',
        queryParams: {
          pageNum: undefined,
          pageSize: undefined,
          teacherId: null,
        },
        user: {},
        tableData: [],
        tableData1: [],
        data1:null,
        url: ""
      }
    },
    methods: {
      getUser() {
        this.id = this.$route.query.id//创建作业后传过来title
        puted(this.id).then(response => {
          this.tableData = response
          console.log(this.tableData)
        })

        // unPut(this.id).then(response => {
        //   this.tableData1 = response
        // })
      },
      /*
      下面为文档预览函数，aa应当为文件路径（位于的seafile的路径）应当传入GetLink，测试环境默认没有传，
      返回的就是同一个文件的路径，可以看到预览效果，
      在相关按钮下绑定改函数即可实现预览
      */
      /**异步文档预览**/ async preView(aa) {
        await GetLink().then(response => {
          this.url = response;
        });
        const base64 = require('js-base64').Base64;
        const exstr = base64.encode('base64');
        console.log('exstr:')
        console.log(exstr);
        let Base64 = require('js-base64').Base64



        // let originUrl = 'http://127.0.0.1:80/ruoyi-admin/';   //要预览文件的访问地址'
        let originUrl = this.url
        console.log(originUrl);
        const bb = originUrl + aa;
        //       const bb = aa;
        console.log('bb')
        console.log(bb)
        console.log('encode:')
        console.log(encodeURIComponent(Base64.encode(bb)))
        console.log("**************************************")
        const reUrl = originUrl
        console.log(reUrl);
        window.open('https://file.kkview.cn/onlinePreview?url=' + encodeURIComponent(Base64.encode(originUrl)));
      },
      getUser1() {
        this.id = this.$route.query.id//创建作业后传过来title
        // console.log(this.id)
        unPut(this.id).then(response => {
          this.tableData = response
        })
      },
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },
      QuestionGive(row){
        this.dialogFormVisible = true
        // console.log(row.id)
        queryById(row.id).then(response =>{
          // console.log(response)
          this.form = response
        })
      },
      save(row){
        //  console.log(this.form.score)
        // console.log(this.$route.query.score)
        const geifen = parseInt(this.form.score)
        const zongfen =parseInt(this.$route.query.score)
        // console.log(geifen +'>'+ zongfen)
        // console.log(geifen > zongfen)
        if (geifen > zongfen){
          this.$message.error("成绩超出最大值")
        }else{
          give(this.form).then(response => {
            if (response.code === 200){
              this.$message.success("修改成绩成功")
              this.dialogFormVisible = false
              this.getUser()

            }else {
              this.$message.error("修改成绩失败")
            }
          })
        }
      },
      QuestionDelete(row){
        Delete(row.id).then(response =>{
          if (response.code === 200) {
            this.$message.success("删除成功")
            this.visible = false
            this.getUser()
          }else
          {
            this.$message.error("删除失败")
          }
        })
      },
      QuestionDetail(row){
        console.log(row);
        // this.$router.push({ path: 'TopicDetail', query: { id: row.id }})
      },
      jump(){
        this.$router.push('teacher/FileBank')
      },
    }
  }
</script>

<style scoped>

</style>
